<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>项目管理 - Powered by MinDoc</title>
    <link th:href="@{/bootstrap/css/bootstrap.min.css}" rel="stylesheet">
    <link th:href="@{/font-awesome/css/font-awesome.min.css}" rel="stylesheet">
    <link th:href="@{/css/main.css}" rel="stylesheet">
</head>
<body>
<div class="manual-reader">
     <div th:replace="/widgets/header :: header"></div>
    <div class="container manual-body">
        <div class="row">
            <div class="page-left">
                <ul class="menu">
                   <li><a href="" class="item"><i class="fa fa-dashboard" aria-hidden="true"></i> 仪表盘</a> </li>
                    <li><a href="/manager/users" class="item"><i class="fa fa-users" aria-hidden="true"></i> 用户管理</a> </li>
                    <li class="active"><a href="/managerbooks" class="item"><i class="fa fa-book" aria-hidden="true"></i> 项目管理</a> </li>
                    <li><a href="/manager/setting" class="item"><i class="fa fa-cogs" aria-hidden="true"></i> 配置管理</a> </li>
                    <li><a href="/manager/attach/list" class="item"><i class="fa fa-cloud-upload" aria-hidden="true"></i> 附件管理</a> </li>
                </ul>
            </div>
            <div class="page-right">
                <div class="m-box">
                    <div class="box-head">
                        <strong class="box-title">项目列表</strong>
                    </div>
                </div>
                  <div class="box-body" id="bookList">
                    <div class="book-list">
                        <template v-if="lists.length <= 0">
                             <div class="text-center">暂无数据</div>
                        </template>
                        <template v-else>

                        <div class="list-item" v-for="item in lists">
                            <div class="book-title">
                                <div class="pull-left">
                                    <a :href="'/book/' + item.identify + '/dashboard'" title="项目概要" data-toggle="tooltip">
                                       <template v-if="item.privately_owned == 0">
                                           <i class="fa fa-unlock" aria-hidden="true"></i>
                                       </template>
                                       <template v-else-if="item.privatelyOwned == 1">
                                           <i class="fa fa-lock" aria-hidden="true"></i>
                                       </template>
                                        ${item.bookName}
                                    </a>
                                </div>
                                <div class="pull-right">
                                    <a :href="'/docs/' + item.identify" title="查看文档" data-toggle="tooltip" target="_blank"><i class="fa fa-eye"></i> 查看文档</a>
                                    <template v-if="item.role_id != 3">
                                        <a :href="'/api/' + item.identify + '/edit'" title="编辑文档" data-toggle="tooltip" target="_blank"><i class="fa fa-edit" aria-hidden="true"></i> 编辑文档</a>
                                    </template>
                                </div>
                                <div class="clearfix"></div>
                            </div>
                            <div class="desc-text">
                                    <template v-if="item.description === ''">
                                        &nbsp;
                                    </template>
                                    <template v-else="">
                                        <a :href="'/book/' + item.identify + '/dashboard'" title="项目概要" style="font-size: 12px;">
                                        ${item.description}
                                        </a>
                                    </template>
                            </div>
                            <div class="info">
                                <span title="创建时间" data-toggle="tooltip" data-placement="bottom"><i class="fa fa-clock-o"></i>
                                    ${(new Date(item.createTime)).format("yyyy-MM-dd hh:mm:ss")}
                                </span>
                                <span title="创建者" data-toggle="tooltip" data-placement="bottom"><i class="fa fa-user"></i> ${item.createName}</span>
                                <span title="文档数量" data-toggle="tooltip" data-placement="bottom"><i class="fa fa-pie-chart"></i> ${item.docCount}</span>
                                <span title="项目角色" data-toggle="tooltip" data-placement="bottom"><i class="fa fa-user-secret"></i> ${item.roleName}</span>
                                <template v-if="item.modifyTime !== ''">
                                    <span title="最后编辑" data-toggle="tooltip" data-placement="bottom"><i class="fa fa-pencil"></i> 最后编辑: ${item.modifyTime}</span>
                                </template>

                            </div>
                        </div>
                        </template>
                    </div>
                    <!-- 分页实现 -->
                    <template v-if="lists.length >= 0">
                        <nav class="pagination-container">
                            
                        </nav>
                    </template>
                </div>
            </div>
        </div>
    </div>
    <div th:replace="/widgets/footer :: footer"></div>
</div>
<script th:src="@{/jquery/1.12.4/jquery.min.js}" type="text/javascript"></script>
<script th:src="@{/bootstrap/js/bootstrap.min.js}" type="text/javascript"></script>
<script th:src="@{/js/main.js}" type="text/javascript"></script>
<script th:src="@{/vuejs/vue.min.js}" type="text/javascript"></script>
<script th:inline="javascript">
//JS中获取对象
/*<![CDATA[*/
var bookList = /*[[${bookList}]]*/;
/*]]>*/
$(function () {
    window.app = new Vue({
            el : "#bookList",
            data : {
                lists : bookList
            },
            delimiters : ['${','}'],
            methods : {
            }
        });
        Vue.nextTick(function () {
            $("[data-toggle='tooltip']").tooltip();
        });
});
</script>
</body>
</html>